<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      for (let i = 0; i < 5; i++) {
        setTimeout(() => {
          console.log(i); // 55555
        }, 0);
      }

      /* 
      {
        let i =0
        setTimeout(() => {
          console.log(i); // 0
        }, 0);
      }
      {
        i=1
        setTimeout(() => {
          console.log(i); // 1
        }, 0);
      }
      {
        i=2
        setTimeout(() => {
          console.log(i); // 2
        }, 0);
      }
      {
        i=4
        setTimeout(() => {
          console.log(i); // 3
        }, 0);
      }
      {
        i=4
        setTimeout(() => {
          console.log(i); // 4
        }, 0);
      }
      */

      /* 
      产生块作用域
      1. 有if/while/for这样的块
      2. let/const定义的变量
      */

      var x = 2;
      // function fn(x, y=function(){x = 3; console.log(x)}) {
      function fn(
        xx,
        y = function () {
          x = 3;
          console.log(x);
        }
      ) {
        console.log(x);
        var x = 4;
        y();
        console.log(x);
      }
      fn(1);
      console.log(x);

      // 1 3 4 2
      // undefined 3 4 3
    </script>

    <script>
      var a1 = 2;
      var a2 = 3;
      // 当给形参指定了默认值, 函数体就形成一个块作用域(在函数作用域内部)
      // 只有形参在函数作用域中, 参数体中定义的变量在块伤作用域中
      function fn(a3, a4 = 4) {
        var a3 = 11;
        var a5 = 4;
        var a6 = 5;
        if (true) {
          let a7 = 8;
          let a8 = 9;
        }
      }
      fn(6, 7);

      (function () {})(function () {})();
    </script>
  </body>
</html>
